<!-- 
*   @Description:公共组件——标题
*   @Author:lxy
*   @Date:2023-03-23 10:23
-->
<template>
  <div>
    <div class="titleHeader_title">
      <div class="title-content">{{ tilte }}</div>
      <slot></slot>
    </div>
    <div class="titleLine" v-if="showLine"></div>
  </div>
</template>

<script>
export default {
  name: "titleHeader",
  props:{
    tilte:{
        type:String,
        default:''
    },
    showLine:{
        type:Boolean,
        default:true
    }
  },
  data() {
    return {};
  },
};
</script>

<style scoped lang="less">
.titleHeader_title{
    background-color: white;
    padding: 20px 0px 20px 60px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: relative;
    .title-content{
        font:bold 16px/24px 'PingFang SC'
    }
    ::after{
        content: '';
        position: absolute;
        left: 40px;
        top: 50%;
        transform: translateY(-50%);
        width: 4px;
        height: 20px;
        background-color: aqua;

    }
}
.titleLine{
    height: 1px;
    background-color: #b3b3b89f;
}
</style>
